// 引入vue
import Vue from 'vue'
// 引入vuex
import Vuex from 'vuex'
// 应用vuex插件
Vue.use(Vuex)
import countOptions from './count'
import personOptions from './person'

// 创建并暴露store
export default new Vuex.Store({
    modules: {
        countAbout: countOptions,
        personAbout: personOptions
    }
})


/* 
vuex的模块化
    为了更好的维护代码，做数据分类
    1.拆分 按功能来拆分不同的模块
    2.配置：
        模块中 开启命名空间，namespaced: true,
        index.js中引用 然后暴露
        modules:{
            modules: {
                countAbout,
                personAbout
            }
        }
    3.组件中
        3.1. 读取state数据
        // 一、自己读取 this.$store.state.countAbout.sum
        // 二、通过mapState方法 
            ...mapState('countAbout',['sum'])
        3.2 读取getter数据
            // 一、自己读取 this.$store.getters['countAbout/bigSum']
            // 二、通过mapGetter方法 
            ...mapState('countAbout',['bigSum'])
        3.3调用dispatch
            // 一、自己调用 this.$store.dispatch('countAbout/jia',n)
            // 二、通过mapActions
                ...mapActions('countAbout',{add:'jia'})
        3.3调用commit
            // 一、自己调用 this.$store.commit('personAbout/ADD_PERSON',pObj)
            // 二、通过mapMutations
                ...mapMutations('countAbout',{add:'JIA'})
*/
